<!DOCTYPE html>
<head>
	<title>bootstrap</title>
	<meta charset="utf-8">
	<script type="text/javascript" src="bootstrap/js/jquery-3.1.1.min.js"></script>
	<script type="text/javascript" src="bootstrap/js/bootstrap.min.js"></script>
	
	<link rel="stylesheet" type="text/css" href="bootstrap/css/bootstrap.min.css">
	<link rel="stylesheet" type="text/css" href="test.css">
	
</head>
<body>
	<h1 class="text-center">TJG’Blog</h1>
	<div class="container">
		<div class="content col-xs-8 col-md-8">
			<div>
				<div class="">
					<img class="img-responsive" alt="Responsive image" src="img/1.jpg">
				</div>
				<div class="bgfff clearfix">
					<h2 class="text-center col-xs-12 col-md-12">FLORAL WALLPAPER</h2>
					<p class="lead col-xs-10 col-md-10 col-md-offset-1">Meh synth Schlitz, tempor duis single-origin coffee ea next level ethnic fingerstache fanny pack nostrud. Photo booth anim 8-bit hella, PBR 3 wolf moon beard Helvetica. Salvia esse nihil, flexitarian Truffaut synth art party deep v chillwave. Seitan High Life reprehenderit consectetur cupidatat kogi. Et leggings fanny pack, elit bespoke vinyl art party Pitchfork selfies master cleanse Kickstarter seitan retro.
					Exercitation photo booth stumptown tote bag Banksy, elit small batch freegan sed. Craft beer elit seitan exercitation, photo booth et 8-bit kale chips proident chillwave deep v laborum. Aliquip veniam delectus, Marfa eiusmod Pinterest in do umami readymade swag.</p>
					<div class="col-xs-4 col-md-4 col-md-offset-4 text-center">
						<button class="btn btn-primary btn-lg">Continue Reading</button>
					</div>
					<div class="lab col-xs-10 col-md-10 col-md-offset-1">
						<span class="col-xs-6 col-md-6">November 20, 2014 by solopine</span>
						<a class="col-xs-4 col-md-4" href="#">5 Comments</a>
					</div>
				</div>
			</div>
			<div>
				<div class="">
					<img class="img-responsive" alt="Responsive image" src="img/2.jpg">
				</div>
				<div class="bgfff clearfix">
					<h2 class="text-center col-xs-12 col-md-12">EXPLORING NEW YORK</h2>
					<p class="lead col-xs-10 col-md-10 col-md-offset-1">Disrupt vero ea id fugiat, lo-fi lomo post-ironic irony kitsch Banksy. Tumblr kale chips single-origin coffee Wes Anderson +1 tousled, disrupt butcher sapiente banh mi brunch nisi irony. Artisan wolf fap lomo, laborum Tumblr anim consequat fashion axe sartorial leggings viral.</p>
					<div class="col-xs-4 col-md-4 col-md-offset-4 text-center">
						<button class="btn btn-primary btn-lg">Continue Reading</button>
					</div>
					<div class="lab col-xs-10 col-md-10 col-md-offset-1">
						<span class="col-xs-6 col-md-6">November 20, 2014 by solopine</span>
						<a class="col-xs-4 col-md-4" href="#">5 Comments</a>
					</div>
				</div>
			</div>
			<div>
				<div class="">
					<img class="img-responsive" alt="Responsive image" src="img/3.jpg">
				</div>
				<div class="bgfff clearfix">
					<h2 class="text-center col-xs-12 col-md-12">SUMMER OUTFIT</h2>
					<p class="lead col-xs-10 col-md-10 col-md-offset-1">Tonx cray commodo, exercitation you probably haven’t heard of them beard cred. Selfies iPhone Kickstarter, drinking vinegar jean shorts fixie consequat flexitarian four loko disrupt dreamcatcher beard craft beer stumptown. Paleo 90′s bitters eu, yr incididunt YOLO sapiente fingerstache.
					Exercitation photo booth stumptown tote bag Banksy, elit small batch freegan sed. Craft beer elit seitan exercitation, photo booth et 8-bit kale chips proident chillwave deep v laborum. Aliquip veniam delectus, Marfa eiusmod Pinterest in do umami readymade swag.</p>
					<div class="col-xs-4 col-md-4 col-md-offset-4 text-center">
						<button class="btn btn-primary btn-lg">Continue Reading</button>
					</div>
					<div class="lab col-xs-10 col-md-10 col-md-offset-1">
						<span class="col-xs-6 col-md-6">November 20, 2014 by solopine</span>
						<a class="col-xs-4 col-md-4" href="#">5 Comments</a>
					</div>
				</div>
			</div>
		</div>
		<div class="col-xs-4 col-md-4">
			<div id="aboutme" class="sidebar clearfix">
				<div class="login_frame col-xs-12 col-md-12 text-center">
					<h5>ABOUT ME</h5>
				</div>
				<div class="col-xs-12 col-md-12 text-center">
					<img class="img-responsive" src="img/11.jpg">
				</div>
				<p class="col-xs-12 col-md-12">Meh synth Schlitz, tempor duis single-origin coffee ea next level ethnic fingerstache fanny pack nostrud. Seitan High Life reprehenderit consectetur cupidatat kogi about me..</p>
			</div>
			<div id="follow" class="sidebar clearfix">
				<div class="login_frame col-xs-12 col-md-12 text-center">
					<h5>SUBSCRIBE & FOLLOW</h5>
				</div>
				<div class="col-xs-12 col-md-12 text-center">
				<p class="col-xs-12 col-md-12">
					<a href=""><span class="glyphicon glyphicon-cloud"></span></a>
					<a href=""><span class="glyphicon glyphicon-scale"></span></a>
					<a href=""><span class="glyphicon glyphicon-search"></span></a>
					<a href=""><span class="glyphicon glyphicon-star-empty"></span></a>
					<a href=""><span class="glyphicon glyphicon-star"></span></a>
					<a href=""><span class="glyphicon glyphicon-zoom-in"></span></a>
					<a href=""><span class="glyphicon glyphicon-trash"></span></a>
					<a href=""><span class="glyphicon glyphicon-download-alt"></span></a>
					<a href=""><span class="glyphicon glyphicon-heart"></span></a>
					<a href=""><span class="glyphicon glyphicon-font"></span></a>
					<a href=""><span class="glyphicon glyphicon-phone-alt"></span></a>
				</p>
					<img class="img-responsive" src="img/12.jpg">
				</div>
			</div>
			<div id="facebook" class="sidebar clearfix">
				<div class="login_frame col-xs-12 col-md-12 text-center">
					<h5>FIND US ON FACEBOOK</h5>
				</div>
				<div class="col-xs-12 col-md-12 text-center">
					<img class="img-responsive" src="img/11.jpg">
				</div>
			</div>
			<div id="cloud" class="sidebar clearfix">
				<div class="login_frame col-xs-12 col-md-12 text-center">
					<h5>TAGCLOUD</h5>
				</div>
				<p class="col-xs-12 col-md-12">
					<button class="btn btn-primary">ADVENTURE</button>
					<button class="btn-warning btn">FLORAL</button>
					<button class="btn-warning btn">PINE</button>
					<button class="text-success btn btn-success">OCEAN</button>
					<button class="btn-info btn">LEAF</button>
					<button class="btn-primary btn">NEW YORK</button>
					<button class="btn-warning btn">NATURE</button>
					<button class="text-success btn btn-success">INSTAGRAM</button>
					<button class="btn-primary btn">FOREST</button>
					<button class="btn-info btn">PACIFIC</button>
				</p>
			</div>
			<div id="cate" class="sidebar clearfix">
				<div class="login_frame col-xs-12 col-md-12 text-center">
					<h5>CATEGORIES</h5>
				</div>
				<div class="dropdown col-xs-10 col-md-10 col-md-offset-1">
					<button class="btn btn-success col-xs-12 col-md-12" data-toggle="dropdown">
						<input class="col-xs-12 col-md-12 form-control" type="text" placeholder="Username">
						<span class="caret"></span>
					</button>
					<ul class="dropdown-menu">
						<li><a href="javascript:;">Action</a></li>
						<li><a href="javascript:;">Another action</a></li>
						<li><a href="javascript:;">Something else here</a></li>
						<li role="separator" class="divider"></li>
						<li><a href="javascript:;">Separated link</a></li>
					</ul>
				</div>
			</div>
		</div>
	</div>

	<div class="container bgfff">
		© 2013 Solo Pine Designs, INC. All Rights Reserved.
	</div>

	
</body>
</html>